<template>
	<view class="login">
		<view class="login_text">
			<text class="text">登 录</text>
		</view>
		<view class="userMsg">
			<u--form labelPosition="left" :model="from" :rules="rules" ref="from">
				<u--input placeholder="请输入账号" v-model="from.username" border="bottom" prefixIcon="account-fill"
					prefixIconStyle="font-size: 22px;color: #1989fa;height:120rpx"></u--input>
				<u--input placeholder="请输入密码" v-model="from.password" border="bottom" prefixIcon="lock-fill"
					prefixIconStyle="font-size: 22px;color: #1989fa;height:120rpx" type="password"></u--input>
			</u--form>
		</view>
		<view class="operation">
			<view class="register" v-for="item in ['登录']" :key="item" @click="signIn(item)">
				{{ item }}
			</view>
		</view>
		<u-notify ref="uNotify" message="Hi uView" :show="show"></u-notify>
		<!-- <view class="forgetPassword">
      <text class="pwd"> 忘记密码？</text>
    </view> -->
	</view>
</template>

<script>
	import {
		loginIn
	} from "@/api/api.js";
	import {
		URL
	} from '@/api/public.js'
	export default {
		data() {
			return {
				show: false,
				from: {
					username: "",
					password: "",
				},
				rules: {
					'username': {
						type: 'string',
						required: true,
						message: '请填写账号',
						trigger: ['blur', 'change']
					},
				}
			};
		},
		methods: {
			signIn(item) {
				if (item === "注册") {
					uni.navigateTo({
						url: "../register/register",
					});
				} else if (item === "登录") {
					uni.request({
						url: `${URL}/login`,
						method: "POST",
						data: {
							username: this.from.username,
							password: this.from.password
						},
						success: (res) => {
							if (res.data.code === 200) {
								try {
									uni.getStorageSync("token") ? uni.clearStorageSync("token") : uni
										.setStorageSync("token", res.data.token);
									uni.setStorageSync("userId", res.data.userId);
									uni.setStorageSync("companyId", res.data.companyId);
									if (uni.getStorageSync("token")) {
										uni.reLaunch({
											url: "/pages/home/home",
										});
									}
								} catch (e) {
									this.$refs.uNotify.show({
										top: 10,
										type: "error",
										message: "系统错误",
										duration: 1000 * 3,
										fontSize: 20,
										safeAreaInsetTop: true,
									});
								}
							}
						}
					})
				}
			},
		},
	};
</script>

<style lang="scss" scoped>
	.login {
		height: 100vh;
		display: flex;
		flex-direction: column;

		.login_text {
			position: relative;
			height: 30vh;

			.text {
				position: absolute;
				bottom: 20px;
				color: #333333;
				font-size: 64rpx;
				padding-left: 60rpx;
				padding-bottom: 60rpx;
			}
		}

		.userMsg {
			padding: 0 50rpx;
		}

		.operation {
			display: flex;
			justify-content: center;
			align-items: center;

			.register {
				text-align: center;
				width: 100%;
				color: #333;
				font-size: 38rpx;
				border-radius: 8px;
				background: #f6f6f6;
				border: 1px solid #f0f0f0;
				height: 100rpx;
				line-height: 100rpx;
				margin: 20rpx;
			}

			.register:last-child {
				color: #f0f0f0;
				background-color: #1989fa;
			}
		}

		.forgetPassword {
			flex: 1;
			position: relative;
			color: #1989fa;

			.pwd {
				position: absolute;
				left: 50%;
				bottom: 60rpx;
				transform: translate(-50%);
			}
		}
	}

	.u-input__content__field-wrapper {
		border: 1px solid #333;
	}
</style>
